 layui.config({
        base: ctx+'/plugin/treetable/'
    }).extend({
        treetable: '/treetable'
    }).use(['table', 'treetable','layer','form'], function () {
    	var form = layui.form;
        var $ = layui.jquery;
        var layer = layui.layer;
        var table = layui.table;
        var treetable = layui.treetable;
        
        //创建表格
       var createTable = function(){
        	// 渲染表格
            layer.load(2);
            treetable.render({
                treeColIndex: 1,
                treeSpid: 0,
                treeIdName: 'id',
                treePidName: 'parentId',
                elem: '#auth-table',
                url: ctx+'/sys/acl/list',
                page: false,
                cols: [[
                    {type: 'numbers'},
                    {field: 'name', minWidth: 200, title: '权限名称'},
                    {field: 'url', title: 'url',width: 200},
                    {field: 'aclDesc', title: '权限标识',width: 120},
                    {field: 'seq', width: 80, align: 'center', title: '排序号'},
                    {field: 'remark', width: 200, align: 'center', title: '备注'},
                    {field: 'operator', width: 120, align: 'center', title: '操作人'},
                    {field: 'operateTime', width:200, align: 'center', title: '操作时间'},
                    {
                        field: 'type', width: 80, align: 'center', templet: function (d) {
                            if (d.type == 0) {
                                return '<span class="layui-badge layui-bg-gray">目录</span>';
                            }
                            if (d.parentId == 1) {
                                return '<span class="layui-badge layui-bg-blue">菜单</span>';
                            } else {
                                return '<span class="layui-badge-rim">权限</span>';
                            }
                        }, title: '类型'
                    },
                    {templet: '#auth-state', width: 120, align: 'center', title: '操作'}
                ]],
                done: function () {
                    layer.closeAll('loading');
                }
            });
        }
        
        createTable();

        table.on('tool(auth-table)',function(obj){
        	var data = obj.data; 
        	  var layEvent = obj.event; 
        	 
        	  if(layEvent === 'del'){
        		  delAcl(data.id);
        	  }else if(layEvent === 'edit'){
        		  edit(data);
        	  }
        });
        
        $('#btn-expand').click(function () {
            treetable.expandAll('#auth-table');
        });

        $('#btn-fold').click(function () {
            treetable.foldAll('#auth-table');
        });
        
        // 删除acl
        function delAcl(id){
        	layer.confirm('确定要删除吗?', function(index){
        		commons.ajax({
            		url :ctx+"/sys/acl/delAcl",
            		data:{
            			'id' : id
            		},
            		success : function(res){
            			layer.msg(res.msg);
            			//刷新权限列表
            			createTable();
            		}
            	});
        		  layer.close(index);
        	});
        	
        }
        
        
        // 编辑acl
        function edit(data){
        	// 回显数据
        	console.info(data);
        	form.val('updateFormFilter',{
        		'id' : data.id,
        		'name' : data.name,
        		'url' : data.url,
        		'aclDesc' : data.aclDesc,
        		'seq' : data.seq,
        		'remark' : data.remark,
        		'type' : data.type
        	});
        	// 下拉框的选择
        	layer.open({
        		  title : '编辑权限',
        		  type: 1,
        		  area: ['400px', '500px'],
        		  content: $('#updateDialog') ,
        		  btn : ['确定','取消'],
        		  yes: function(index, layero){
        			  commons.ajax({
        				  url : ctx+'/sys/acl/update',
        				  date : $('#updateFormFilter').serialize(),
        				  success : function(res){
        					  layer.msg(res.msg);
        					  layer.close(index);
        					  createTable();
        				  }
        			  });
        		  },
    			  btn2: function(index, layero){
    				  layer.close(index);
    			  }
          	});
        }
});